<h1>ZC11 Jquery & Json With Zend Controllers!</h1>
<!-- <h2>Message: <? //$this->message ?></h2> -->
<h2>Find items usign JSON and JQuery</h2>
<a hrref="#" id="getItems">Get Items!</a>

<br>
<input type="text" id="tbItemId" value="" />
<a hrref="#" id="findItems">Find Item!</a>


<dl id="items">

</dl>

<script type="text/javascript">
    $(function()
    {
        $('#getItems').click(function()
        {
            getAllItemsJson();
            return false;
        });

        $('#findItems').click(function()
        {
            if ($('#tbItemId').val().length == 0)
            {
               getAllItemsJson();
            }
            getItemsJson($('#tbItemId').val());
            return false;
        });

    });

    function getItemsJson(itemId)
    {
        $.post(
            "/async/getitembyid",
            {
                "itemId" : itemId
            },
            function(data)
            {
                $('#items').append('<dt>'+data.id+': '+data.name+'</dt>');
                $('#items').append('<dd>'+data.description+'</dd>');
            },
            'json'
        );
    }

    function getAllItemsJson()
    {
        $.post(
            "/async/getitems",
            {},
            function(data)
            {
                for (var i=0;i<data.length;i++)
                {
                    $('#items').append('<dt>'+data[i].id+': '+data[i].name+'</dt>');
                    $('#items').append('<dd>'+data[i].description+'</dd>');
                }
            },
            'json'
        );
    }
</script>